<template>
  <div class="wrap">
    <div class="wrapper">
      <Top :projectId="baojing"></Top>
      <div class="shu-moluai">

<div class="sideba">
     
          <div class="right-sidebar">
            <div class="cewen-bar"> 阈值管理 </div>
            <div class="conn-bar" id="style-1">
              <div class="item-conn lie-bg" @click="zuzhi()" >
                   组织管理
                </div>
                <div class="item-conn lie-bg" @click="renyuan()" >
                   人员管理
                </div>
                <div class="item-conn lie-bg1"  >
                   阈值管理
                </div>
                 <!-- <div class="item-conn lie-bg" @click="shishi()" >
                  实时数据
                </div>
                <div class="item-conn lie-bg" @click="chaobiao()">
                  抄表数据
                </div> -->
            </div>
            </div>
        </div>

          <div class="main-dianli-bottom" id="style-1">
             <div class="mainbg-tit">传感器电压</div>
				<!-- 一组结束 -->

				<div class="con-dianvv1" >
				 <table>
          <tr>
            <td class="tuniao">设备名称</td>
            <td class="tuniao">所属部门</td>
            <td class="tuniao">设备编码</td>
            <td class="tuniao">预警阈值</td>
            <td class="tuniao">报警阈值</td>
            <td class="tuniao biaowidth">操作</td>
          </tr>
          <tr v-for="(item,index) in userlist" :key= "index">
            <td>{{item.name}}</td>
            <td class="huang">{{item.dept_name}}</td>
            <td >{{item.code}}</td>
            <td class="lanse" >
              {{item.warm_early_warning}}
              </td>
            <td class="lvse">{{item.warm_warning}}</td>
            <td class="huang">
                <el-button type="warning" icon="el-icon-refresh-left"  @click="xianzhifun(item)">设置上下限</el-button>
              </td>
          </tr>
        </table>
				</div>
        <el-dialog :z-index="2" title="设置设备阈值" :modal-append-to-body="false"  :visible.sync="dialogchongzhiVisible" width="700px" class="my-info-dialog">
        <el-form :model="chongzhiform" :rules="chongzhiRules" ref="chongzhiform">
          <el-form-item label="上限" :label-width="formLabelWidth"  class="labyang" prop="one">
            <el-input v-model="chongzhiform.one" oninput="if(isNaN(value)) { value = null } if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}"
maxLength='9' class="maclass1"></el-input>
          </el-form-item>
          <el-form-item label="下限" :label-width="formLabelWidth" prop="two" class="labyang">
            <el-input v-model="chongzhiform.two"  oninput="if(isNaN(value)) { value = null } if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}"
maxLength='9' class="maclass1"></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="dialogchongzhiVisible = false">取 消</el-button>
          <el-button class="xinanniu"  @click="xianzhisubmitForm('chongzhiform')">保 存</el-button>
        </div>
      </el-dialog>





        <div class="fenye">
                  <el-pagination
                    background
                          @current-change="handleCurrentChange"
                    layout="prev, pager, next"
                    :page-size="pageSize"
                    :total="total" class="fenyone">
                  </el-pagination>
                </div>
				<!-- 右边模块一 -->
				
				
				
			</div>

        <!-- 右边结束 -->
      </div>
    </div>
  </div>
</template>
<script>
import Top from "../../components/common/top.vue";
export default {
  components: { Top },
  data(){
       var validatepasstwo = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('报警阈值不能为空'));
        } else if (value < this.chongzhiform.one) {
          callback(new Error('报警值必须大于预警值'));
        } else {
          callback();
        }
      };
    return{
       baojing:0,//不想
       total:0,
      pageSize:12,
      current:1,
      currentIndex:0,
      pId:'',
        formLabelWidth:'100px',
     
        dialogchongzhiVisible: false,
        chongzhiform: {
          id:'',
          one: '',
          two: '',
        },
        chongzhiRules: {
        one: [
          { required: true, message: '预警阈值不能为空',trigger: 'blur' },
        ],
        two: [
           {  required: true,validator: validatepasstwo,trigger: 'blur' },
        ],
        },
    
       userlist:[]


     
    }
  },
  beforeDestroy() {
    clearInterval(this.tm2);
  },
  mounted(){
    this.setcabinetfun()
    this.warningfun()
    this.tm2 = setInterval(() => {
      this.warningfun()
    }, 30000);
  },
  methods:{
    renyuan(){
      this.$router.push({path:'/set'})
    },
    chaobiao(){
      this.$router.push({path:'/meterreading'})
    },
    shishi(){
      this.$router.push({path:'/realtime'})
    },
      zuzhi(){
      this.$router.push({path:'/organization'})
    },
  
xianzhifun(val){
      console.log('数据',val)
      this.dialogchongzhiVisible = true
      this.dangqianedit = val
      this.chongzhiform.one =val.warm_early_warning
      this.chongzhiform.two =val.warm_warning
    },
      xianzhisubmitForm(formName) {
        this.$refs[formName].validate((valid) => {
          console.log(valid) 
          if (valid) {
            console.log(this.chongzhiform)
            this.dangqianedit.warm_early_warning = this.chongzhiform.one
            this.dangqianedit.warm_warning = this.chongzhiform.two
            console.log("this.dangqianedit",this.dangqianedit)
      this.loginLoading = true;
      this.$apiv.editsetcabinet(this.dangqianedit).then((res) => {
           console.log("222222222",res)
          if(res.code == 0 || res.code== 2000){
                  this.$notify({
          title: '成功',
          message: '修改成功',
          type: 'success',
          duration: 2000
        })
                }else{
                  this.$notify.error({
          title: '失败',
          message: '修改失败'
        });}
        this.setcabinetfun()
        this.dialogchongzhiVisible=false  


          this.loginLoading = false;
        })
        .catch((res) => {
          this.loginLoading = false;
        });
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      

    warningfun(){
       this.loginLoading = true;
      this.$apiv.warning({}).then((res) => {
        console.log("ggg",res.data)
         if(res.data.is_ok== true){
          this.baojing = 1
        }else{
          this.baojing = 0
        }
          this.loginLoading = false;
        })
        .catch((res) => {
          this.loginLoading = false;
        });
    },
    setcabinetfun(){
      this.loginLoading = true;
      this.$apiv.setcabinet({page:this.current,limit:this.pageSize}).then((res) => {
           console.log("111111111111111111111111111",res)
           this.userlist = res.data.data
           this.total = res.data.total
          this.loginLoading = false;
        })
        .catch((res) => {
          this.loginLoading = false;
        });
    },
    goDepartEquip(index,id){
      this.currentIndex = index
      this.pId = id
      console.log(this.pId)
  
    },
    voltagedetailfun(){
      this.loginLoading = true;
      this.$apiv.voltagedetail({page:this.current,limit:this.pageSize}).then((res) => {
        console.log(res.data)
          this.equipList = res.data.data
					this.total = res.data.total
          this.loginLoading = false;
        })
        .catch((res) => {
          this.loginLoading = false;
        });
    },
     handleCurrentChange(val){
       console.log(`当前页: ${val}`)
      this.current = val
      this.setcabinetfun()
  
    },
  },
};
</script>

<style scoped>
@import url("../../../static/zhuti.css");
</style>